import React from 'react';
import {
  Box,
  Divider,
  Button,
  Pressable,
  Text,
  Actionsheet,
  useDisclose,
  Avatar,
} from 'native-base';
import {TextInput} from 'react-native';
import Add_SVG from '../public/icons/add';
import Arrow_SVG from '../public/icons/arrow';
const AddPaper = props => {
  //data
  const [paper,setPaper]=React.useState({
    title:'',
    content:'',
    usergroupId:''
  })
  const {
    isOpen,
    onOpen,
    onClose
  } = useDisclose()
  //render
  return (
    <Box style={{backgroundColor: '#fff',flex:1}}>
      <Box
        style={{
          backgroundColor: '#fff',
          height: 50,
          display: 'flex',
          flexDirection: 'row',
          justifyContent: 'space-between',
          alignItems: 'center',
          paddingBottom: 5,
          paddingTop: 5,
          borderBottomWidth: 1,
          borderColor: '#ccc',
        }}>
        <Arrow_SVG></Arrow_SVG>
        <Text fontSize={18} style={{marginLeft: 30}}>
          帖子
        </Text>
        <Button
          style={{borderRadius: 20, width: 60, marginRight: 10}}
          colorScheme={'red'}>
          发布
        </Button>
      </Box>
      <TextInput
        style={{backgroundColor: '#fff'}}
        placeholder="请输入帖子标题"
        fontSize={18}></TextInput>
      <Divider></Divider>
      <TextInput
        style={{backgroundColor: '#fff', height: 150}}
        placeholder="请输入正文"
        fontSize={14}
        multiline
        textAlignVertical="top"></TextInput>

      <Box>
        <Pressable
          onPress={() => {}}
          style={{
            width: 100,
            height: 100,
            backgroundColor: '#f3f3f3',
            display: 'flex',
            justifyContent: 'center',
            alignItems: 'center',
            marginLeft: 10,
            borderRadius: 10,
          }}>
          <Add_SVG></Add_SVG>
        </Pressable>
      </Box>
      <Divider style={{marginTop:10,marginBottom:10}}></Divider>
      <Box style={{display:'flex',flexDirection:'row',justifyContent:'flex-start',alignItems:'center'}}>
        <Text style={{fontSize: 20, marginLeft: 10,marginRight:10}}>选择社区:</Text>
        <Button style={{height:40,width:100}} colorScheme='red' onPress={onOpen} variant='link'>添加</Button>
        <Actionsheet isOpen={isOpen} onClose={onClose}>
        <Actionsheet.Content>
          <Actionsheet.Item>Delete</Actionsheet.Item>
          <Actionsheet.Item isDisabled>Share</Actionsheet.Item>
          <Actionsheet.Item>Play</Actionsheet.Item>
          <Actionsheet.Item>Favourite</Actionsheet.Item>
          <Actionsheet.Item>Cancel</Actionsheet.Item>
        </Actionsheet.Content>
      </Actionsheet>
      </Box>
    </Box>
  );
};
export default AddPaper;
